<template>
  <BasicDrawer v-bind="$attrs" @register="registerDrawer" title="接口详情" width="700px">
    <Description class="channel--define-desc" :data="detailData" @register="registerDescription" />
  </BasicDrawer>
</template>
<script lang="ts" setup>
  import { ref, useAttrs } from "vue"
  import { BasicDrawer, useDrawerInner } from "/@/components/Drawer"
  import { formDetailSchema } from "./payIfDefine.data"
  import { Description, useDescription } from "/@/components/Description/index"
  import { getByIfCode } from "/@/api/pay"
  const emit = defineEmits(["register"])
  const attrs = useAttrs()

  const [registerDescription] = useDescription({
    // data: mockData,
    schema: formDetailSchema,
    column: 4,
    bordered: false,
    labelStyle: {
      marginLeft: "10px",
    },
  })

  const detailData = ref({})
  const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
    setDrawerProps({ confirmLoading: false })
    const detail = await getByIfCode({ ifCode: data.record.ifCode })
    detailData.value = detail
  })
</script>

<style lang="less">
  .channel--define-desc {
    margin-right: 10px;
  }
</style>
